<!--
 * @Author: your name
 * @Date: 2022-04-27 09:17:45
 * @LastEditTime: 2023-01-10 11:08:10
 * @LastEditors: wangwang 2723008256@qq.com
 * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 * @FilePath: \jzjy\src\views\Dashboard\index.vue
-->
<template>
  <div id="container">
    <div class="top">
      <div class="banner">
        <el-carousel :height="bannerHeight + 'px'">
          <el-carousel-item v-for="(item, index) in bannerList" :key="index">
            <img
              :src="item.file_url"
              alt="banner图"
              @click="advert(item.http_url)"
            />
          </el-carousel-item>
        </el-carousel>
      </div>
    </div>
    <div class="information">
      <div class="content" v-if="type == 1">
        <div class="title">个人数据</div>
        <ul>
          <li>
            <img src="../../assets/img/images/index_1.png" />
            <p>累计入驻天数</p>
            <span
              ><h2>{{ ljrzts }}</h2>
              天</span
            >
          </li>
          <li>
            <img src="../../assets/img/images/index_2.png" />
            <p>周资源下载数</p>
            <span
              ><h2>{{ ljzyxz }}</h2>
              份</span
            >
          </li>
          <li>
            <img src="../../assets/img/images/index_3.png" />
            <p>周在线时长</p>
            <span
              ><h2>{{ ljzxsc }}</h2>
              min</span
            >
          </li>
          <li>
            <img src="../../assets/img/images/index_4.png" />
            <p>周访问次数</p>
            <span
              ><h2>{{ ljfwcs }}</h2>
              次</span
            >
          </li>
          <li>
            <img src="../../assets/img/images/index_5.png" />
            <p>累计参加活动数</p>
            <span
              ><h2>{{ ljcjhds }}</h2>
              次</span
            >
          </li>
        </ul>
      </div>
      <div class="content" v-if="type == 2">
        <div class="title">学校数据</div>
        <ul class="xiaozhang">
          <li>
            <img src="../../assets/img/images/index_1.png" />
            <p>累计入驻天数</p>
            <span
              ><h2>{{ ljrzts }}</h2>
              天</span
            >
          </li>
          <li>
            <img src="../../assets/img/images/index_xiaozhang.png" />
            <p>本校已注册用户</p>
            <span
              ><h2>{{ bxyzcyh }}</h2>
              人</span
            >
          </li>
          <li>
            <img src="../../assets/img/images/index_2.png" />
            <p>周资源下载数</p>
            <span
              ><h2>{{ ljzyxz }}</h2>
              份</span
            >
          </li>
          <li>
            <img src="../../assets/img/images/index_3.png" />
            <p>本校平均停留时长</p>
            <span
              ><h2>{{ pjtlsc }}</h2>
              min</span
            >
          </li>
          <li>
            <img src="../../assets/img/images/index_4.png" />
            <p>周访问次数</p>
            <span
              ><h2>{{ ljfwcs }}</h2>
              次</span
            >
          </li>
          <li>
            <img src="../../assets/img/images/index_5.png" />
            <p>累计参加活动人数</p>
            <span
              ><h2>{{ ljcjhds }}</h2>
              人</span
            >
          </li>
        </ul>
      </div>
    </div>
    <div class="gaoyier" v-if="nianji_id != 11">
      <div class="resTop">
        <div class="dingzhi">
          <div class="dingzhiTitle">为您定制</div>
          <div class="timeLine">
            <div class="timeNow">
              <p>当前时间</p>
              <span>{{ nowMonth }}月</span>
            </div>
            <div class="msg">
              <h3>{{ nowMonth }}月：{{ base_title }}</h3>
              <span @click="goEditPlan">修改</span>
            </div>
          </div>
        </div>
        <div
          class="beikeTaps"
          v-if="
            gyezy1 > 0 ||
            gyesp1 > 0 ||
            gyezy2 > 0 ||
            gyesp2 > 0 ||
            gyezy3 > 0 ||
            gyesp3 > 0
          "
        >
          <el-radio-group
            v-model="dingzhiRadio"
            size="medium"
            text-color="#fff"
            @change="dingzhiChange"
          >
            <el-radio-button label="1" v-if="gyezy1 > 0 || gyesp1 > 0">
              <img
                src="../../assets/img/images/indexTab_1.png"
                v-show="dingzhiRadio == '1'"
              />
              <div v-show="dingzhiRadio != '1'">
                <img src="../../assets/img/images/indexTab_4.png" /> 教师教研
              </div>
            </el-radio-button>
            <el-radio-button label="2" v-if="gyezy2 > 0 || gyesp2 > 0"
              ><img
                src="../../assets/img/images/indexTab_2.png"
                v-show="dingzhiRadio == '2'"
              />
              <div v-show="dingzhiRadio != '2'">
                <img src="../../assets/img/images/indexTab_6.png" />教师教学
              </div></el-radio-button
            >
            <el-radio-button label="3" v-if="gyezy3 > 0 || gyesp3 > 0"
              ><img
                src="../../assets/img/images/indexTab_3.png"
                v-show="dingzhiRadio == '3'"
              />
              <div v-show="dingzhiRadio != '3'">
                <img src="../../assets/img/images/indexTab_5.png" />学生学习
              </div></el-radio-button
            >
          </el-radio-group>
        </div>
      </div>
      <div
        class="recommend"
        v-if="
          gyezy1 > 0 ||
          gyesp1 > 0 ||
          gyezy2 > 0 ||
          gyesp2 > 0 ||
          gyezy3 > 0 ||
          gyesp3 > 0
        "
      >
        <div class="recommend">
          <div class="someRecommend">
            <div class="resMsg">
              <div class="msg">
                <p
                  v-html="contents1 ? contents1 : '暂无内容'"
                  v-show="dingzhiRadio == '1'"
                ></p>
                <p
                  v-html="contents2 ? contents2 : '暂无内容'"
                  v-show="dingzhiRadio == '2'"
                ></p>
                <p
                  v-html="contents3 ? contents3 : '暂无内容'"
                  v-show="dingzhiRadio == '3'"
                ></p>
              </div>
              <div
                class="littleTittle"
                v-show="dingzhiRadio == '1' && gyezy1 > 0"
              >
                <h3>备课资源包</h3>
              </div>
              <div
                class="littleTittle"
                v-show="dingzhiRadio == '2' && gyezy2 > 0"
              >
                <h3>教学资源包</h3>
              </div>
              <div
                class="littleTittle"
                v-show="dingzhiRadio == '3' && gyezy3 > 0"
              >
                <h3>复习资源包</h3>
              </div>
              <div
                class="beike"
                v-for="item in gyezyLists"
                :key="item.id"
                @mouseenter="beikeMouseEnter(item.id)"
              >
                <div class="beike1" v-show="!beikeFlag && n == item.id">
                  <div class="left">
                    <img
                      src="../../assets/img/ziyuan.png"
                      v-if="item.lx == 2"
                      style="height: 80px"
                    />
                    <img
                      src="../../assets/img/resFile (1).png"
                      alt="file_url"
                      v-if="
                        item.fileType == 'ppt' ||
                        item.fileType == 'pptx' ||
                        item.fileType == 'ppsx' ||
                        item.fileType == 'pps'
                      "
                    />
                    <img
                      src="../../assets/img/resFile (2).png"
                      alt="file_url"
                      v-if="item.fileType == 'mp4' || item.fileType == 'rm'"
                    />
                    <img
                      src="../../assets/img/resFile (3).png"
                      alt="file_url"
                      v-if="item.fileType == 'xls' || item.fileType == 'xlsx'"
                    />
                    <img
                      src="../../assets/img/resFile (4).png"
                      alt="file_url"
                      v-if="item.fileType == 'zip' || item.fileType == 'rar'"
                    />
                    <img
                      src="../../assets/img/resFile (5).png"
                      alt="file_url"
                      v-if="item.fileType == 'm4a' || item.fileType == 'mp3'"
                    />
                    <img
                      src="../../assets/img/resFile (6).png"
                      alt="file_url"
                      v-if="item.fileType == 'doc' || item.fileType == 'docx'"
                    />
                    <img
                      src="../../assets/img/resFile (7).png"
                      alt="file_url"
                      v-if="item.fileType == 'pdf'"
                    />
                    <img
                      src="../../assets/img/resFile (8).png"
                      alt="file_url"
                      v-if="item.fileType == 'png' || item.fileType == 'jpg'"
                    />
                  </div>
                  <div class="details">
                    <div class="title">
                      <span v-if="item.is_tj == 1">推荐</span>
                      <h3 @click="gokejianbaoRes(item.id, item.lx)">
                        {{ item.title }}
                      </h3>
                    </div>
                    <div class="msg">
                      <p v-html="item.intro" v-if="item.lx == 1"></p>
                      <p v-html="item.sub_info" v-if="item.lx == 2"></p>
                      <!-- <span style="heigth: 8px" class="shengluehao"
                        >......</span
                      > -->
                      <div class="bottom">
                        <span class="upTime"
                          >更新于{{
                            timeStamp2String(item.update_time * 1000, 2)
                          }}</span
                        >
                        <!-- <span
                          class="upTime"
                          v-if="item.from_int == 21 || item.lx == 2"
                          >更新于{{
                            timeStamp2String(item.update_time * 1000, 2)
                          }}</span
                        >
                        <span
                          class="upTime"
                          v-if="item.from_int == 10"
                          style="color: #ff9b04"
                        >
                          精选
                        </span> -->
                        <span class="seeNum" v-if="item.lx == 1"
                          ><i class="el-icon-view"></i
                          >{{ item.viewCount }}</span
                        >
                        <span class="seeNum" v-if="item.lx == 2"
                          ><i class="el-icon-view"></i
                          >{{ item.view_nums }}</span
                        >
                        <span
                          class="recNum"
                          v-if="item.lx == 2 && kejian_nums > 1"
                          >共<a>{{ item.kejian_nums }}</a
                          >份资源</span
                        >
                      </div>
                    </div>
                  </div>
                  <div
                    class="seeAll"
                    @click="gokejianbaoRes(item.id, item.lx)"
                    v-show="!beikeFlag && n == item.id"
                  >
                    <span>查看全部</span>
                  </div>
                </div>
                <div class="beike2" v-show="!beikeFlag && n != item.id">
                  <div class="left">
                    <img
                      src="../../assets/img/ziyuan.png"
                      v-if="item.lx == 2"
                      style="height: 60px"
                    />
                    <img
                      src="../../assets/img/resFile (1).png"
                      alt="file_url"
                      v-if="
                        item.fileType == 'ppt' ||
                        item.fileType == 'pptx' ||
                        item.fileType == 'ppsx' ||
                        item.fileType == 'pps'
                      "
                    />
                    <img
                      src="../../assets/img/resFile (2).png"
                      alt="file_url"
                      v-if="item.fileType == 'mp4' || item.fileType == 'rm'"
                    />
                    <img
                      src="../../assets/img/resFile (3).png"
                      alt="file_url"
                      v-if="item.fileType == 'xls' || item.fileType == 'xlsx'"
                    />
                    <img
                      src="../../assets/img/resFile (4).png"
                      alt="file_url"
                      v-if="item.fileType == 'zip' || item.fileType == 'rar'"
                    />
                    <img
                      src="../../assets/img/resFile (5).png"
                      alt="file_url"
                      v-if="item.fileType == 'm4a' || item.fileType == 'mp3'"
                    />
                    <img
                      src="../../assets/img/resFile (6).png"
                      alt="file_url"
                      v-if="item.fileType == 'doc' || item.fileType == 'docx'"
                    />
                    <img
                      src="../../assets/img/resFile (7).png"
                      alt="file_url"
                      v-if="item.fileType == 'pdf'"
                    />
                    <img
                      src="../../assets/img/resFile (8).png"
                      alt="file_url"
                      v-if="item.fileType == 'png' || item.fileType == 'jpg'"
                    />
                  </div>
                  <div class="details">
                    <div class="title">
                      <span v-if="item.is_tj == 1">推荐</span>
                      <h3>{{ item.title }}</h3>
                    </div>
                    <div class="msg">
                      <div class="bottom">
                        <span class="upTime"
                          >更新于{{
                            timeStamp2String(item.update_time * 1000, 2)
                          }}</span
                        >
                        <span class="seeNum" v-if="item.lx == 1"
                          ><i class="el-icon-view"></i
                          >{{ item.viewCount }}</span
                        >
                        <span class="seeNum" v-if="item.lx == 2"
                          ><i class="el-icon-view"></i
                          >{{ item.view_nums }}</span
                        >
                        <span
                          class="recNum"
                          v-if="item.lx == 2 && kejian_nums > 1"
                          >共<a>{{ item.kejian_nums }}</a
                          >份资源</span
                        >
                      </div>
                    </div>
                  </div>
                </div>
              </div>
              <div
                class="littleTittle"
                v-show="dingzhiRadio == '1' && gyesp1 > 0"
              >
                <h3>教研课</h3>
              </div>
              <div
                class="littleTittle"
                v-show="dingzhiRadio == '2' && gyesp2 > 0"
              >
                <h3>教学课</h3>
              </div>
              <div
                class="littleTittle"
                v-show="dingzhiRadio == '3' && gyesp3 > 0"
              >
                <h3>学生学习课</h3>
              </div>
              <div class="jiaoyan">
                <div
                  class="box"
                  v-for="item in gyespLists"
                  :key="item.jyjxkinfo_id"
                  @click="goJiaoyanclass(item.jyjxk_id)"
                >
                  <img :src="item.fm_file_url" alt="" />
                  <div class="activename">
                    {{ item.title }}
                  </div>
                  <p>主讲人：{{ item.teachers_title }}</p>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="gaosan" v-if="nianji_id == 11">
      <div class="resTop">
        <div class="dingzhi">
          <div class="dingzhiTitle">为您定制</div>
          <div class="timeLine">
            <div class="timeNow">
              <p>当前时间</p>
              <span>{{ nowMonth }}月</span>
            </div>
            <div class="msg">
              <h3>{{ nowMonth }}月：{{ base_title }}</h3>
              <span @click="goEditPlan">修改</span>
            </div>
          </div>
        </div>
        <div class="beikeTaps">
          <el-radio-group
            v-model="dingzhiRadio"
            size="medium"
            text-color="#fff"
            @change="dingzhiChange"
          >
            <el-radio-button
              label="1"
              v-if="gszy1 > 0 || gszx1 > 0 || gssp1 > 0"
            >
              <img
                src="../../assets/img/images/gsTap1.png"
                v-show="dingzhiRadio == '1'"
              />
              <div v-show="dingzhiRadio != '1'">
                <img src="../../assets/img/gstap1.1.png" /> 一轮复习
              </div>
            </el-radio-button>
            <el-radio-button
              label="2"
              v-if="gszy2 > 0 || gszx2 > 0 || gssp2 > 0"
              ><img
                src="../../assets/img/images/gsTap2.png"
                v-show="dingzhiRadio == '2'"
              />
              <div v-show="dingzhiRadio != '2'">
                <img src="../../assets/img/gstap1.2.png" />二轮复习
              </div></el-radio-button
            >
            <el-radio-button
              label="4"
              v-if="gszy3 > 0 || gszx3 > 0 || gssp3 > 0"
              ><img
                src="../../assets/img/images/gsTap3.png"
                v-show="dingzhiRadio == '4'"
              />
              <div v-show="dingzhiRadio != '4'">
                <img src="../../assets/img/gstap1.4.png" />试卷
              </div></el-radio-button
            >
          </el-radio-group>
        </div>
      </div>
      <div class="gsContents">
        <div class="left">
          <div class="leftTitle">
            <h2>最新资源</h2>
            <span @click="gogszy">查看全部</span>
          </div>
          <div
            class="gsResbox"
            v-for="item in gszyLists"
            :key="item.id"
            @mouseenter="gsbeikeMouseEnter(item.id)"
          >
            <div
              class="kejianBox1"
              v-show="!beikeFlag && gs == item.id"
              @click="goresDetails(item.id, item.lx)"
            >
              <div class="kejianfile">
                <img
                  src="../../assets/img/ziyuan.png"
                  v-if="item.lx == 2"
                  style="height: 74px"
                />
                <img
                  src="../../assets/img/resFile (1).png"
                  alt="file_url"
                  v-if="
                    item.fileType == 'ppt' ||
                    item.fileType == 'pptx' ||
                    item.fileType == 'ppsx' ||
                    item.fileType == 'pps'
                  "
                />
                <img
                  src="../../assets/img/resFile (2).png"
                  alt="file_url"
                  v-if="item.fileType == 'mp4' || item.fileType == 'rm'"
                />
                <img
                  src="../../assets/img/resFile (3).png"
                  alt="file_url"
                  v-if="item.fileType == 'xls' || item.fileType == 'xlsx'"
                />
                <img
                  src="../../assets/img/resFile (4).png"
                  alt="file_url"
                  v-if="item.fileType == 'zip' || item.fileType == 'rar'"
                />
                <img
                  src="../../assets/img/resFile (5).png"
                  alt="file_url"
                  v-if="item.fileType == 'm4a' || item.fileType == 'mp3'"
                />
                <img
                  src="../../assets/img/resFile (6).png"
                  alt="file_url"
                  v-if="item.fileType == 'doc' || item.fileType == 'docx'"
                />
                <img
                  src="../../assets/img/resFile (7).png"
                  alt="file_url"
                  v-if="item.fileType == 'pdf'"
                />
                <img
                  src="../../assets/img/resFile (8).png"
                  alt="file_url"
                  v-if="item.fileType == 'png' || item.fileType == 'jpg'"
                />
              </div>
              <div class="msg">
                <div class="title">{{ item.title }}</div>
                <div class="bottom">
                  <span class="upTime" v-if="item.from_int != 10">
                    更新于{{ timeStamp2String(item.update_time * 1000, 2) }}
                  </span>
                  <span
                    class="upTime"
                    v-if="item.from_int == 10"
                    style="color: #ff9b04"
                  >
                    精选
                  </span>
                  <span class="seeNum" v-if="!item.lx || item.lx == 1"
                    ><i class="el-icon-view"></i>{{ item.viewCount }}</span
                  >
                  <span class="seeNum" v-if="item.lx == 2"
                    ><i class="el-icon-view"></i>{{ item.view_nums }}</span
                  >
                </div>
              </div>
            </div>
            <div class="kejianBox2" v-show="!beikeFlag && gs != item.id">
              <div class="kejianfile">
                <img
                  src="../../assets/img/ziyuan.png"
                  v-if="item.lx == 2"
                  style="height: 74px"
                />
                <img
                  src="../../assets/img/resFile (1).png"
                  alt="file_url"
                  v-if="
                    item.fileType == 'ppt' ||
                    item.fileType == 'pptx' ||
                    item.fileType == 'ppsx' ||
                    item.fileType == 'pps'
                  "
                />
                <img
                  src="../../assets/img/resFile (2).png"
                  alt="file_url"
                  v-if="item.fileType == 'mp4' || item.fileType == 'rm'"
                />
                <img
                  src="../../assets/img/resFile (3).png"
                  alt="file_url"
                  v-if="item.fileType == 'xls' || item.fileType == 'xlsx'"
                />
                <img
                  src="../../assets/img/resFile (4).png"
                  alt="file_url"
                  v-if="item.fileType == 'zip' || item.fileType == 'rar'"
                />
                <img
                  src="../../assets/img/resFile (5).png"
                  alt="file_url"
                  v-if="item.fileType == 'm4a' || item.fileType == 'mp3'"
                />
                <img
                  src="../../assets/img/resFile (6).png"
                  alt="file_url"
                  v-if="item.fileType == 'doc' || item.fileType == 'docx'"
                />
                <img
                  src="../../assets/img/resFile (7).png"
                  alt="file_url"
                  v-if="item.fileType == 'pdf'"
                />
                <img
                  src="../../assets/img/resFile (8).png"
                  alt="file_url"
                  v-if="item.fileType == 'png' || item.fileType == 'jpg'"
                />
              </div>
              <div class="title">{{ item.title }}</div>
              <span>{{ timeStamp2String(item.update_time * 1000, 3) }}</span>
            </div>
          </div>
          <div class="nothingGszy" v-if="nothingShow">
            <img src="../../assets/img/nothing.png" alt="" />
          </div>
        </div>
        <div class="right">
          <h2>专项资源</h2>
          <div
            class="gsResbox"
            v-if="dingzhiRadio == '1' || dingzhiRadio == '2'"
          >
            <div
              class="picTap1"
              v-for="(item, index) in gszxLists"
              :key="index"
              @click="
                gogszx(
                  item.kejianbooks_id,
                  item.kejianchapters_id,
                  item.kejianfl_id,
                  item.kejiantag_id,
                  item.kemu_id,
                  item.nianji_id,
                  item.title,
                  index
                )
              "
            >
              <img :src="item.file_url" alt="" />
            </div>
          </div>
          <div class="gsResbox" v-if="dingzhiRadio == '4'">
            <div
              class="picTap2"
              v-for="(item, index) in gszxLists"
              :key="index"
              @click="
                gogszx(
                  item.kejianbooks_id,
                  item.kejianchapters_id,
                  item.kejianfl_id,
                  item.kejiantag_id,
                  item.kemu_id,
                  item.nianji_id,
                  item.title,
                  index
                )
              "
            >
              <img :src="item.file_url" alt="" />
            </div>
          </div>
        </div>
      </div>
      <div class="recommend">
        <div class="recommend">
          <div class="someRecommend">
            <div class="resMsg" v-if="gsspLists.length > 0">
              <div class="littleTittle">
                <h3>课程推荐</h3>
              </div>
              <div class="jiaoyan">
                <div
                  class="box jiaoyanbox"
                  v-for="item in gsspLists"
                  :key="item.jyjxkinfo_id"
                  @click="goJiaoyanclass(item.jyjxk_id)"
                >
                  <img :src="item.fm_file_url" alt="" />
                  <div class="activename">
                    {{ item.title }}
                  </div>
                  <p>主讲人：{{ item.teachers_title }}</p>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="pickAcPr" v-show="haveAc || havePr">
      <div class="pickAC" v-if="haveAc">
        <div class="pickTop">
          <span></span>
          <h4>本月定制活动</h4>
        </div>
        <div class="left">
          <img :src="file_url" alt="" class="banner" />
          <img
            src="../../assets/img/active/baomingzhong.png"
            v-if="timeNow < start_time * 1000"
            class="yuyue"
          />
          <img
            src="../../assets/img/active/yijiesu.png"
            v-if="timeNow > end_time * 1000"
            class="yuyue"
          />
          <img
            src="../../assets/img/active/zhibozhong.png"
            v-if="timeNow > start_time * 1000 && timeNow < end_time * 1000"
            class="yuyue"
          />
          <div class="msg">
            <h2>{{ acTitle }}</h2>
            <span v-if="timeNow < end_time * 1000"
              >{{ timeStamp2String(start_time * 1000, 1) }}（{{
                timeStamp2String(start_time * 1000, 11)
              }}）{{ timeStamp2String(start_time * 1000, 5) }}</span
            >
            <span v-if="timeNow > end_time * 1000"
              >活动心得已更新<a style="color: red">{{ hdxd_nums }}</a
              >份</span
            >
            <div
              class="playAnniu"
              v-if="bm_status == 0 && timeNow < end_time * 1000"
              @click="goActiveDetails"
              style="background: #f85230"
            >
              立即报名
            </div>
            <div
              class="playAnniu"
              v-if="bm_status == 1 || timeNow > end_time * 1000"
              @click="goActiveDetails"
            >
              <!-- <img src="../../assets/img/active/playSmall.png" /> -->
              立即查看
            </div>
          </div>
        </div>
      </div>
      <div class="pickPr" v-if="prList.length != 0">
        <div class="pickTop">
          <span></span>
          <h4>本月推荐产品</h4>
        </div>
        <div class="right">
          <div class="prBox" v-for="item in prList" :key="item.id">
            <img :src="item.file_url" alt="" />
            <div class="msg">
              <h3 @click="goProductDetails(item.id)">{{ item.title }}</h3>
              <p>权威编者：{{ item.author }}</p>
              <span :class="{ highF: item.recommend_number >= 80 }"
                >图书推荐值：{{ item.recommend_number }}%</span
              >
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="baibaoxiang">
      <h2>精准教研教学百宝箱</h2>
      <div class="content">
        <div class="box" @click="goActiveCenter">
          <img src="../../assets/img/images/index_6.png" alt="" />
          <p>活动中心</p>
        </div>
        <div class="box" @click="goResourceCenter">
          <img src="../../assets/img/images/index_7.png" alt="" />
          <p>资源中心</p>
        </div>
        <!-- <div class="box" @click="goProductCenter">
          <img src="../../assets/img/images/index_8.png" alt="" />
          <p>产品中心</p>
        </div> -->
        <div class="box" @click="goPersonalCenter">
          <img src="../../assets/img/images/index_9.png" alt="" />
          <p>个人中心</p>
        </div>
        <!-- <div class="box" @click="goStatistical">
          <img src="../../assets/img/images/index_10.png" alt="" />
          <p>统计分析</p>
        </div> -->
      </div>
    </div>
    <!-- 首次进入网站未有年级科目版本弹窗 -->
    <el-dialog
      title=""
      :visible.sync="dialogTableVisible"
      :close-on-click-modal="false"
      :close-on-press-escape="false"
      :show-close="false"
      center
      width="600px"
    >
      <div class="chose">
        <p>1.请选择您所在的年级：</p>
        <div class="tab1 taps">
          <div
            class="classRadio"
            v-for="item in nianjiList"
            :key="item.id"
            @click="radio3 = item.id"
          >
            <div class="tips1 tips" v-if="radio3 != item.id"><span></span></div>
            <div class="tips2 tips" v-if="radio3 == item.id"><span></span></div>
            <p>{{ item.title }}</p>
          </div>
        </div>
        <p>2.请选择您所教的学科：</p>
        <div class="tab1 taps">
          <div
            class="classRadio"
            v-for="item in classList"
            :key="item.id"
            @click="changeKemu(item.id)"
          >
            <div class="tips1 tips" v-if="radio1 != item.id"><span></span></div>
            <div class="tips2 tips" v-if="radio1 == item.id"><span></span></div>
            <p>{{ item.title }}</p>
          </div>
        </div>
        <p>3.请选择您所教学科的教学版本：</p>
        <div class="tab2 taps">
          <div
            class="classRadio"
            v-for="item in banbenList"
            :key="item.id"
            @click="radio2 = item.id"
          >
            <div class="tips1 tips" v-if="radio2 != item.id"><span></span></div>
            <div class="tips2 tips" v-if="radio2 == item.id"><span></span></div>
            <p>{{ item.title }}</p>
          </div>
        </div>
        <div class="submitSet" @click="submit">
          <span>提交</span>
        </div>
      </div>
    </el-dialog>
    
  </div>
</template>

<script>
import { timeStamp2String } from "../../utils/time";
import {
  banner,
  sjtj,
  nowkemu,
  userinfo,
  zyzxinfo,
  zyzxgs,
  activityindex,
  getbookbyprogress,
  nianjilists,
  kemulists,
  versionslists,
  setnowkemu,
  sysinfo,
} from "../../api/http";
export default {
  components: {},
  data() {
    return {
      bannerHeight: "",
      dialogTableVisible: false, //提交信息弹窗
      
      bannerList: [], //banner图表
      timeStamp2String, //时间戳转时间的函数
      //个人数据
      ljrzts: 0, //累计入驻天数
      bxyzcyh: 0, //本校已注册用户
      ljzyxz: 0, //累计资源下载
      ljzxsc: 0, //累计在线时长
      pjtlsc:0,//平均在线时长
      ljfwcs: 0, //累计访问次数
      ljcjhds: 0, //累计参加活动数
      type: "", //个人数据还是学校数据

      //为您定制
      zyzxMsg: {}, //资源数据汇总信息
      base_title: "123", //当前计划名称标题
      kejianbooks_title: "", //当前学习的书本名
      kejianchapters_title: "", //当前学习的目录名
      fenlei_radio: 1, //试卷分类值
      start_date: "", //当前计划开始时间
      end_date: "", //当前计划结束时间
      stime: "", //开始的那一天
      etime: "", //结束的那天
      smonth: "", //计划开始的月份
      emonth: "", //计划结束的月份
      kejianbao_nums: "", //资源包数量
      kejian_nums: "", //资源数量
      kejianbooks_id: 0, //书本id
      kemu_id: 0, //当前科目id
      nianji_id: 0, //当前年级id
      kejianversions_id: 0, //当前版本id
      kejianchapters_id: 0, //目录id
      status: "", //是否当前
      nowMonth: "", //当前几月份
      // 资源定制部分
      dingzhishow: true, //定制部分是否展示
      dingzhiRadio: "1", //定制切换栏按钮默认值
      //资源包信息介绍
      contents: "", //整理来源介绍
      contents1: "", //教师教研介绍//一轮复习介绍
      contents2: "", //教师教学介绍//二轮复习介绍
      contents3: "", //学生学习介绍//三轮复习介绍 //暂无
      contents4: "", //真题试卷介绍
      //高一高二
      gyezyLists: [], //教师教研课件包资
      gyespLists: [], //教师教学课件包数量
      gyezy1: 0, //高一二部分教师教研资源数量
      gyezy2: 0, //高一二部分教师教学资源数量
      gyezy3: 0, //高一二部分学生学习资源数量

      gyesp1: 0, //高一二部分教师教研视频数量
      gyesp2: 0, //高一二部分教师教学视频数量
      gyesp3: 0, //高一二部分学生学习视频数量

      radio: "1", //调查有用没用
      beikeFlag: false, //资源包hover样式切换
      n: 0, //当前鼠标移动到的资源包的id

      //高三部分
      gszyLists: [], //高三部分的最新资源列表
      gszxLists: [], //高三部分的专项列表
      gsspLists: [], //高三部分的视频列表
      gszy1: 0, //一轮复习课件包数量
      gszy2: 0, //二轮复习课件包数量
      gszy3: 0, //试卷课件包数量
      gszx1: 0, //一轮复习专项数量
      gszx2: 0, //二轮复习专项数量
      gszx3: 0, //试卷专项数量
      gssp1: 0, //一轮复习视频数量
      gssp2: 0, //二轮复习视频数量
      gssp3: 0, //试卷视频数量
      gs: 0, //高三部分鼠标移动到的资源包id
      nothingShow: false, //空图是否展示

      //推荐活动和产品
      timeNow: new Date().getTime(), //当前时间的时间戳
      activeId: "", //推荐的活动的id
      file_url: "", //活动封面
      start_time: "", //活动开始时间
      end_time: "", //活动结束时间
      acTitle: "", //活动主题
      bm_status: 0, //活动报名状态
      hdxd_nums: 0, //活动更新数量
      prList: [], //产品列表
      haveAc: true, //有没有推荐的活动
      havePr: true, //有没有推荐的产品

      //首次进入弹窗相关内容
      nianjiList: [], //可选年级列表
      classList: [], //学科列表
      banbenList: [], //版本列表
      radio3: "", //年级值
      radio1: "", //学科值
      radio2: "", //版本值


    };
  },
  created() {
    //回到顶部
    $(document).ready(function () {
      $(window).scrollTop(0);
    });
    //获取主页banner图
    banner({
      md5key: localStorage.getItem("md5key"),
      systypes_id: 10000,
      device_type_id: 201,
    }).then((res) => {
      console.log(res, "主页banner");
      if (res.retInt == 1) {
        this.bannerList = res.retRes;
      } else if (res.retInt == 0) {
        this.$message.error(res.retErr);
      }
    });
    //获取主页数据统计
    sjtj({
      md5key: localStorage.getItem("md5key"),
    }).then((res) => {
      console.log(res, "数据统计");
      const data = res.retRes;
      if (res.retInt == 1) {
        this.ljrzts = data.ljrzts;
        this.bxyzcyh = data.bxyzcyh;
        this.ljzyxz = data.ljzyxz;
        this.ljzxsc = data.ljzxsc;
        this.pjtlsc = data.pjtlsc
        this.ljfwcs = data.ljfwcs;
        this.ljcjhds = data.ljcjhds;
        this.type = data.type;
      } else if (res.retInt == 0) {
        this.$message.error(res.retErr);
      }
    });
    // 系统信息
    // sysinfo().then((res) => {
    //   // console.log(res, "右侧悬浮窗");
    //   this.kf_file_url = res.retRes.kf_file_url;
    //   this.xcx_file_url = res.retRes.xcx_file_url;
    // });
    // kemulists().then((res) => {
    //   console.log(res);
    // });
    //获取当前个人信息
    userinfo({
      md5key: localStorage.getItem("md5key"),
    }).then((res) => {
      if (res.retInt == 1 && res.retRes.sy_end_time * 1000 > Date.parse(new Date())) {
        console.log(res, "个人信息");
        console.log(this.nianji_id, "当前年级id");
        const data = res.retRes;
        this.nianji_id = data.nianji_id; //当前年级id
        this.radio3 = data.nianji_id; //赋值初次弹窗年级id
        if (this.nianji_id != 11) {
          //获取进入页面后上半部分的资源包和当前计划的高一高二相关数据
          zyzxinfo({
            md5key: localStorage.getItem("md5key"),
          }).then((res) => {
            if (res.retInt == 1) {
              console.log(res, "课件包数据信息汇总");
              const data = res.retRes;
              this.base_title = data.base_title;
              this.start_date = data.start_date; //教学计划开始时间
              this.end_date = data.end_date; //教学计划结束时间
              this.contents = data.contents;
              this.contents1 = data.info_1.contents;
              this.contents2 = data.info_2.contents;
              this.contents3 = data.info_3.contents;
              this.kejianbao_nums = data.kejianbao_nums;
              this.kejian_nums = data.kejian_nums;
              this.zyzxMsg = data; //汇总信息
              this.fk_status = data.fk_status;
              this.gyezy1 = data.info_1.zy_lists.length; //高一二部分教师教研资源数量
              this.gyezy2 = data.info_2.zy_lists.length; //高一二部分教师教学资源数量
              this.gyezy3 = data.info_3.zy_lists.length; //高一二部分学生学习资源数量
              this.gyesp1 = data.info_1.sp_lists.length; //高一二部分教师教研资源数量
              this.gyesp2 = data.info_2.sp_lists.length; //高一二部分教师教学资源数量
              this.gyesp3 = data.info_3.sp_lists.length; //高一二部分学生学习视频数量
              const jiaoyan = this.gyezy1 + this.gyesp1; //教师教研总内容数量
              const jiaoxue = this.gyezy2 + this.gyesp2; //教师教研总内容数量
              const xuesheng = this.gyezy3 + this.gyesp3; //教师教研总内容数量
              if (jiaoyan > 0) {
                this.gyezyLists = data.info_1.zy_lists;
                this.gyespLists = data.info_1.sp_lists;
                this.dingzhiRadio = "1";
              } else if (jiaoyan == 0 && jiaoxue > 0) {
                this.gyezyLists = data.info_2.zy_lists;
                this.gyespLists = data.info_2.sp_lists;
                this.dingzhiRadio = "2";
              } else if (jiaoyan == 0 && jiaoxue == 0 && xuesheng > 0) {
                this.gyezyLists = data.info_3.zy_lists;
                this.gyespLists = data.info_3.sp_lists;
                this.dingzhiRadio = "3";
              }
              // if(this.gyezy1 == 0 && this.gyezy2 == 0 && )
            }
          });
        } else {
          zyzxgs({
            md5key: localStorage.getItem("md5key"),
          }).then((res) => {
            if (res.retInt == 1) {
              console.log(res, "高三资源中心信息汇总");
              const data = res.retRes;
              this.base_title = data.base_title;
              this.start_date = data.start_date; //教学计划开始时间
              this.end_date = data.end_date; //教学计划结束时间
              this.contents = data.contents; //高三定制资源简介
              this.contents1 = data.info_1.contents;
              this.contents2 = data.info_2.contents;
              this.contents4 = data.info_4.contents;
              this.kejianbao_nums = data.kejianbao_nums;
              this.kejian_nums = data.kejian_nums;
              this.zyzxMsg = data; //汇总信息
              this.fk_status = data.fk_status;
              this.gszy1 = data.info_1.zy_lists.length; //一轮复习课件包数量
              this.gszy2 = data.info_2.zy_lists.length; //二轮复习课件包数量
              this.gszy3 = data.info_4.zy_lists.length; //试卷课件包数量
              this.gszx1 = data.info_1.zx_lists.length; //一轮复习专项数量
              this.gszx2 = data.info_2.zx_lists.length; //二轮复习专项数量
              this.gszx3 = data.info_4.zx_lists.length; //试卷专项数量
              this.gssp1 = data.info_1.sp_lists.length; //一轮复习视频数量
              this.gssp2 = data.info_2.sp_lists.length; //二轮复习视频数量
              this.gssp3 = data.info_4.sp_lists.length; //试卷视频数量
              const yilun = this.gszy1 + this.gszx1 + this.gssp1; //一轮复习下的资源总量
              const erlun = this.gszy2 + this.gszx2 + this.gssp2; //二轮复习下的资源总量
              const shijuan = this.gszy3 + this.gszx3 + this.gssp3; //试卷下的资源总量
              console.log(yilun, erlun, "一轮复习下的资源总量");
              if (yilun > 0) {
                this.gszyLists = data.info_1.zy_lists;
                // this.gs = data.info_1.zy_lists[0].id;
                this.gszxLists = data.info_1.zx_lists;
                this.gsspLists = data.info_1.sp_lists;
                this.dingzhiRadio = "1";
                if (this.gszyLists.length > 0) {
                  this.gs = data.info_1.zy_lists[0].id;
                }
              } else if ((yilun = 0 && erlun > 0)) {
                this.gszyLists = data.info_2.zy_lists;
                // this.gs = data.info_2.zy_lists[0].id;
                this.gszxLists = data.info_2.zx_lists;
                this.gsspLists = data.info_2.sp_lists;
                this.dingzhiRadio = "2";
                if (this.gszyLists.length > 0) {
                  this.gs = data.info_2.zy_lists[0].id;
                }
              } else if (yilun == 0 && erlun == 0 && shijuan > 0) {
                this.gszyLists = data.info_4.zy_lists;
                // this.gs = data.info_4.zy_lists[0].id;
                this.gszxLists = data.info_4.zx_lists;
                this.gsspLists = data.info_4.sp_lists;
                this.dingzhiRadio = "3";
                if (this.gszyLists.length > 0) {
                  this.gs = data.info_4.zy_lists[0].id;
                }
              }
              if (this.gszyLists.length == 0) {
                this.nothingShow = true;
              } else {
                this.nothingShow = false;
              }
            }
          });
        }
        //获取当前科目和版本
        nowkemu({
          md5key: localStorage.getItem("md5key"),
        }).then((res) => {
          if (res.retInt == 1) {
            console.log(res, "当前科目和版本");
            const data = res.retRes;
            this.status = data.is_now; //是否当前
            //如果当前的版本或科目为0，跳转到选择版本页
            if (data.kejianversions_id == 0 || data.kemu_id == 0) {
              // this.$alert("您还未选择学科或版本，请先前往选择", "温馨提示", {
              //   confirmButtonText: "确定",
              //   callback: () => {
              //     this.$router.push({
              //       name: "ChangeClass",
              //     });
              //   },
              // });
              //如果当前的计划开始时间结束时间不存在或科目为0，跳转到设置教学计划
            } else if (data.have_plan == 0) {
              // this.$alert("您目前还没有教学计划，请先前往设置", "温馨提示", {
              //   confirmButtonText: "确定",
              //   callback: () => {
              //     this.$router.push({
              //       name: "MyTeachPlan",
              //     });
              //   },
              // });
            } else {
              this.kejianversions_id = data.kejianversions_id; //当前版本id
              this.radio2 = data.kejianversions_id; //赋值初次弹窗版本id
              this.kejianchapters_id = data.kejianchapters_id; //当前目录id
              this.kejianbooks_id = data.kejianbooks_id; //当前书本id
              // this.start_date = data.start_date; //教学计划开始时间
              // this.end_date = data.end_date; //教学计划结束时间
              this.kemu_id = data.kemu_id; //当前科目id
              this.radio1 = data.kemu_id; //赋值初次弹窗科目id
              this.kejianbooks_title = data.kejianbooks_title; //当前学习的书本名
              this.kejianchapters_title = data.kejianchapters_title; //当前学习的目录名
              this.timeLine = data.timeline;
              console.log(
                this.kejianchapters_id,
                "一进来就要判断的目录id，如果有，正常显示，如果没有，隐藏推荐"
              );
            }
          } else {
            this.$notify.error({
              title: "错误",
              message: res.retErr,
              duration: 2000,
              showClose: false,
            });
          }
        });
        //如果后端提示需要设置年级科目版本
        if (res.retRes.kemunianji_set == 0) {
          this.dialogTableVisible = true;
          //获取年级列表数据
          nianjilists({ md5key: localStorage.getItem("md5key") }).then(
            (res) => {
              console.log(res, "年级列表");
              const data = res.retRes;
              if (res.retInt == 1) {
                this.nianjiList = data;
              }
            }
          );
          //获取科目列表
          kemulists({ md5key: localStorage.getItem("md5key") }).then((res) => {
            console.log(res, "科目列表");
            const data = res.retRes;
            if (res.retInt == 1) {
              this.classList = data;
            }
          });
          setTimeout(() => {
            //获取教学版本列表
            versionslists({
              md5key: localStorage.getItem("md5key"),
              kemu_id: this.radio1 ? this.radio1 : "1",
            }).then((res) => {
              console.log(res, "版本列表");
              const data = res.retRes;
              if (res.retInt == 1) {
                this.banbenList = data;
              }
            });
          }, 200);
        }
      }else if(res.retRes.sy_end_time * 1000 < Date.parse(new Date())){
        this.$router.push({
          name: "Login",
          query: {
            isgq: 1,
          },
        });
      }
    });
    //主页活动推荐
    activityindex({
      md5key: localStorage.getItem("md5key"),
    }).then((res) => {
      if (res.retInt == 1) {
        console.log(res, "首页活动推荐");
        if (res.retRes.length != 0) {
          const data = res.retRes[0];
          this.file_url = data.file_url;
          this.acTitle = data.title;
          this.start_time = data.start_time;
          this.end_time = data.end_time;
          this.hdxd_nums = data.hdxd_nums;
          this.bm_status = data.bm_status;
          this.activeId = data.id;
          console.log(this.activeId, "asdasd ");
        } else {
          this.haveAc = false;
        }
      }
    });
    //主页推荐产品
    getbookbyprogress({
      md5key: localStorage.getItem("md5key"),
    }).then((res) => {
      if (res.retInt == 1) {
        console.log(res, "主页推荐产品");
        if (res.retRes.length != 0) {
          this.prList = res.retRes;
        } else {
          this.havePr = false;
          console.log("没有");
        }
      }
    });
  },
  mounted() {
    this.nowMonth = new Date().getMonth() + 1; //本月月份
    const nowMonth = document.getElementsByClassName("timeNow")[0];
    console.log(this.nowMonth, "HSJSJKFHSDJKHSHSDJK");
    const timeLeft = 98; //月份之间的间隔距离
    const firstMonth = 38; //一月左边距离
    if (this.nowMonth == 1) {
      nowMonth.style.left = firstMonth + "px";
    } else {
      nowMonth.style.left = (this.nowMonth - 1) * timeLeft + firstMonth + "px";
    }
    //获取可视化窗口宽度,适应
    const screenWidth = document.documentElement.clientWidth;
    console.log(screenWidth / (1920 / 280), "asdadasd");
    this.bannerHeight = screenWidth / (1920 / 280);
    const that = this;
    window.onresize = () => {
      return (() => {
        const screenWidth = document.documentElement.clientWidth;
        if (screenWidth >= 1200) {
          that.bannerHeight = screenWidth / (1920 / 280);
        } else if (screenWidth < 1200) {
          that.bannerHeight = 1200 / (1920 / 280);
        }
      })();
    };
  },
  methods: {
    //跳转广告图
    advert(href) {
      window.open(href, "_blank");
    },
    //调整教学计划
    goEditPlan() {
      this.$router.push({
        name: "MyTeachPlan",
      });
    },
    //定制栏切换事件
    dingzhiChange(e) {
      console.log(e);
      this.dingzhiRadio = e;
      if (this.nianji_id != 11) {
        if (e == "1") {
          this.gyezyLists = this.zyzxMsg.info_1.zy_lists;
          this.gyespLists = this.zyzxMsg.info_1.sp_lists;
        } else if (e == "2") {
          this.gyezyLists = this.zyzxMsg.info_2.zy_lists;
          this.gyespLists = this.zyzxMsg.info_2.sp_lists;
        } else if (e == "3") {
          this.gyezyLists = this.zyzxMsg.info_3.zy_lists;
          this.gyespLists = this.zyzxMsg.info_3.sp_lists;
        }
      } else {
        if (e == "1") {
          this.gszyLists = this.zyzxMsg.info_1.zy_lists;
          // this.gs = this.zyzxMsg.info_1.zy_lists[0].id;
          this.gszxLists = this.zyzxMsg.info_1.zx_lists;
          this.gsspLists = this.zyzxMsg.info_1.sp_lists;
          console.log(this.gsspLists, "yilun 视频");
          if (this.gszyLists.length > 0) {
            this.gs = this.zyzxMsg.info_1.zy_lists[0].id;
          }
        } else if (e == "2") {
          this.gszyLists = this.zyzxMsg.info_2.zy_lists;
          // this.gs = this.zyzxMsg.info_2.zy_lists[0].id;
          this.gszxLists = this.zyzxMsg.info_2.zx_lists;
          this.gsspLists = this.zyzxMsg.info_2.sp_lists;
          console.log(this.gsspLists, "二轮 视频");
          if (this.gszyLists.length > 0) {
            this.gs = this.zyzxMsg.info_2.zy_lists[0].id;
          }
        } else if (e == "4") {
          this.gszyLists = this.zyzxMsg.info_4.zy_lists;
          // this.gs = this.zyzxMsg.info_4.zy_lists[0].id;
          this.gszxLists = this.zyzxMsg.info_4.zx_lists;
          this.gsspLists = this.zyzxMsg.info_4.sp_lists;
          console.log(this.gsspLists, "试卷 视频");
        }
        if (this.gszyLists.length == 0) {
          this.nothingShow = true;
        } else {
          this.nothingShow = false;
          this.gs = this.zyzxMsg.info_4.zy_lists[0].id;
        }
      }
    },
    //前往高三最新资源列表页
    gogszy() {
      console.log(
        this.dingzhiRadio,
        this.kemu_id,
        this.nianji_id,
        this.zyzxMsg.info_1.kejianbooks_id
      );
      if (this.dingzhiRadio == 1) {
        this.$router.push({
          name: "Gszy",
          query: {
            type: this.dingzhiRadio,
            kemu_id: this.kemu_id,
            nianji_id: this.nianji_id,
            kejianbooks_id: this.zyzxMsg.info_1.kejianbooks_id,
          },
        });
      } else if (this.dingzhiRadio == 2) {
        this.$router.push({
          name: "Gszy",
          query: {
            type: this.dingzhiRadio,
            kemu_id: this.kemu_id,
            nianji_id: this.nianji_id,
            kejianbooks_id: this.zyzxMsg.info_2.kejianbooks_id,
          },
        });
      } else if (this.dingzhiRadio == 4) {
        this.$router.push({
          name: "Gszy",
          query: {
            type: this.dingzhiRadio,
            kemu_id: this.kemu_id,
            nianji_id: this.nianji_id,
          },
        });
      }
      // list_kejian({
      //   md5key: localStorage.getItem("md5key"),
      //   kemu_id:this.kemu_id,
      //   nianji_id : this.nianji_id,
      //   type_id : 2,
      //   page_size:50,
      // }).then(res=>{
      //   console.log(res)
      // })
    },
    //前往高三专项资源列表
    gogszx(
      kejianbooks_id,
      kejianchapters_id,
      kejianfl_id,
      kejiantag_id,
      kemu_id,
      nianji_id,
      title,
      index
    ) {
      //将专项数组删除点点击的那个一起传过去
      localStorage.setItem("zxArr", JSON.stringify(this.gszxLists));
      const arr = this.gszxLists;
      // arr.splice(index,1)
      //把当前选中的定制tap分类也带过去，方便判断是否是试卷
      // console.log(JSON.parse(JSON.stringify(arr)))
      this.$router.push({
        name: "Gszx",
        query: {
          kejianbooks_id: kejianbooks_id,
          kejianchapters_id: kejianchapters_id,
          kejianfl_id: kejianfl_id,
          kejiantag_id: kejiantag_id,
          kemu_id: kemu_id,
          nianji_id: nianji_id,
          title: title,
          type: this.dingzhiRadio,
          index: index,
        },
      });
    },
    //鼠标移入备课资源包
    beikeMouseEnter(id) {
      this.beikeFlag = false;
      // console.log(id);
      this.n = id;
      // console.log(this.beikeFlag);
    },
    //高三部分鼠标移入备课资源包
    gsbeikeMouseEnter(id) {
      // this.beikeFlag = false;
      console.log(id);
      this.gs = id;
      // console.log(this.beikeFlag);
    },
    //前往校验课内容
    goJiaoyanclass(jyjxk_id) {
      this.$router.push({
        name: "JiaoyanClass",
        query: {
          id: jyjxk_id,
        },
      });
    },
    //点击课件前往课件详情
    goresDetails(id, lx) {
      console.log(id, lx);
      //有分类型，并且类型为贝壳资源包
      if (lx && lx == 2) {
        let { href } = this.$router.resolve({
          path: "/resource/beikeziyuan",
          query: {
            id: id,
          },
        });
        window.open(href, "_blank");
        //有分类型，并且类型为课件
      } else if (lx && lx == 1) {
        // console.log("推荐课件")
        let { href } = this.$router.resolve({
          path: "/resource/resDetails",
          query: {
            id: id,
          },
        });
        window.open(href, "_blank");
        //非推荐，全部为正常课件
      } else {
        let { href } = this.$router.resolve({
          path: "/resource/resDetails",
          query: {
            id: id,
          },
        });
        window.open(href, "_blank");
      }
    },
    // 前往备课资源包
    gokejianbaoRes(id, lx) {
      console.log(id, lx);
      if (lx == 1) {
        let { href } = this.$router.resolve({
          path: "/resource/resDetails",
          query: {
            id: id,
          },
        });
        window.open(href, "_blank");
      } else {
        let { href } = this.$router.resolve({
          path: "/resource/beikeziyuan",
          query: {
            id: id,
          },
        });
        window.open(href, "_blank");
      }
    },
    //前往推荐的活动
    goActiveDetails() {
      this.$router.push({
        name: "ActiveDetails",
        query: {
          id: this.activeId,
        },
      });
    },
    //前往推荐的产品
    goProductDetails(id) {
      this.$router.push({
        name: "ProductDetails",
        query: {
          id: id,
        },
      });
    },
    //前往活动中心
    goActiveCenter() {
      this.$router.push({
        path: "/active",
      });
    },
    //前往资源中心
    goResourceCenter() {
      this.$router.push({
        path: "/resource",
      });
    },
    //前往产品中心
    goProductCenter() {
      this.$router.push({
        path: "/product",
      });
    },
    //前往个人中心
    goPersonalCenter() {
      this.$router.push({
        path: "/personal",
      });
    },
    //前往查看数据统计
    goStatistical() {
      this.$router.push({
        path: "/active",
      });
    },
    //首次弹窗
    //切换科目后，版本会更新为选择的科目版本
    changeKemu(id) {
      this.radio1 = id;
      this.radio2 = "";
      //获取教学版本列表
      versionslists({
        kemu_id: this.radio1,
      }).then((res) => {
        console.log(res, "版本列表");
        const data = res.retRes;
        if (res.retInt == 1) {
          this.banbenList = data;
        }
      });
    },
    //提交设置的科目和版本
    submit() {
      console.log(this.radio3, this.radio1, this.radio2);
      if (!this.radio1) {
        this.$message({
          message: "请选择学科",
          duration: 1000,
          showClose: false,
        });
      } else if (!this.radio2) {
        this.$message({
          message: "请选择版本",
          duration: 1000,
          showClose: false,
          offset: 300,
        });
      } else if (!this.radio3) {
        this.$message({
          message: "请选择年级",
          duration: 1000,
          showClose: false,
          offset: 300,
        });
      } else {
        setnowkemu({
          md5key: localStorage.getItem("md5key"),
          kemu_id: this.radio1,
          kejianversions_id: this.radio2,
          nianji_id: this.radio3,
          is_now: 1,
        }).then((res) => {
          console.log(res, "设置科目版本");
          this.$notify.closeAll();
          this.$notify({
            message: "设置科目和版本成功",
            duration: 2000,
            showClose: false,
          });
          this.dialogTableVisible = false;
        });
      }
    },
    //我知道了
    reday(){
      this.$router.push({
        name: "home",
      });
    },
  },
};
</script>

<style lang="less" scoped>
#container {
  width: 100%;
  height: 100%;
  background-color: #f0f2f5;
  .title {
    margin-top: 39px;
    margin-bottom: 39px;
    margin-left: 20px;
    text-align: left;
    font-size: 24px;
    font-weight: bold;
    color: #333333;
    line-height: 34px;
  }
  .goDetail {
    margin: 20px auto;
    width: 200px;
    text-align: center;
    line-height: 30px;
    border: 1px solid orange;
    border-radius: 30px;
  }
  .top {
    width: 100%;
    background-color: #e4e4e4;
    .banner {
      margin: 0px auto;
      width: 100%;
      .el-carousel {
        width: 100%;
        height: 100%;
        // border-radius: 20px;
        .el-carousel__item {
          width: 100%;
          height: 100%;
          img {
            width: 100%;
            height: 100%;
          }
        }
      }
    }
  }
  .information {
    width: 1200px;
    margin: 20px auto;
    background-color: #fff;
    border-radius: 10px;
    overflow: hidden;
    .content {
      ul {
        display: flex;
        flex-wrap: wrap;
        // justify-content: space-around;
        margin-bottom: 40px;
        li {
          display: flex;
          flex-direction: column;
          align-items: center;
          margin-right: 30px;
          width: 200px;
          height: 148px;
          background: #ffffff;
          border: 1px solid #dee0e3;
          border-radius: 12px;
          cursor: pointer;
          img {
            margin-top: 16px;
            width: 50px;
            height: 50px;
            background: #ebfaf5;
            border-radius: 50%;
          }
          p {
            font-size: 14px;
            font-weight: 400;
            color: #333333;
            line-height: 34px;
          }
          span {
            display: flex;
            color: #08a579;
            line-height: 45px;
            h2 {
              margin-right: 8px;
              font-size: 32px;
              font-family: DIN;
              font-weight: 600;
              color: #08a579;
              line-height: 34px;
            }
          }
        }
        li:first-child {
          margin-left: 35px;
        }
      }
      .xiaozhang {
        li {
          width: 170px;
          height: 148px;
          margin-right: 20px;
        }
      }
    }
  }
  .gaoyier,
  .gaosan {
    overflow: hidden;
    .resTop {
      margin: 0 auto;
      margin-top: 20px;
      width: 100%;
      // margin-top: 36px;
      width: 1200px;
      padding: 0;
      background: #fff;
      border-radius: 8px 8px 1px 1px;
      overflow: hidden;
      //定制
      .dingzhi {
        position: relative;
        top: 20px;
        display: flex;
        flex-direction: column;
        // border-bottom: 1px solid #ccc;
        .dingzhiTitle {
          margin: 15px 0 35px 20px;
          // margin-left: 20px;
          font-size: 24px;
          color: #333;
          font-weight: 600;
        }
        .timeLine {
          position: relative;
          padding: 0 20px;
          width: 1160px;
          height: 200px;
          background-image: url(../../assets/img/images/lineTime.png);
          border-radius: 20px 20px 0px 0px;
          overflow: hidden;

          .el-steps {
            margin-top: 29px;
          }
          .timeNow {
            display: inline-block;
            position: absolute;
            top: 25px;
            left: 0;
            p {
              margin-bottom: 7px;
              font-size: 12px;
              color: #08a579;
            }
            span {
              display: inline-block;
              text-align: center;
              font-size: 16px;
              font-weight: 600;
              line-height: 45px;
              color: #fff;
              width: 44px;
              height: 48px;
              background-image: url(../../assets/img/images/timeNow.png);
            }
          }
          .msg {
            position: relative;
            top: 125px;
            left: 231px;
            h3 {
              display: inline-block;
              margin-right: 18px;
              font-size: 20px;
              font-weight: bold;
              color: #333333;
              line-height: 34px;
            }
            span {
              display: inline-block;
              margin-top: 4px;
              text-align: center;
              width: 60px;
              height: 26px;
              border: 1px solid #08a579;
              border-radius: 14px;
              font-size: 14px;
              color: #08a579;
              line-height: 26px;
              cursor: pointer;
            }
          }
        }
      }
      //切换栏
      .beikeTaps {
        position: static;
        top: 80px;
        // text-align: center;
        height: 60px;
        padding-top: 20px;
        background-color: #fff;
        z-index: 100000;
        // box-shadow:inset 0 -4px 5px -3px #08a579;
      }
      /deep/.el-radio-group {
        display: inline-block;
        width: 1200px;
        height: 48px;
        background: #f0f2f5;
      }
      /deep/.el-radio-button__inner {
        display: inline-block;
        padding: 0;
        margin: 0;
        text-align: center;
        width: 400px;
        height: 48px;
        line-height: 48px;
        font-size: 16px;
        background: #f0f2f5;
        color: #969799;
        font-weight: bold;
        border: 0;
        border-radius: 8px 8px 0px 0px;
        box-shadow: 0px 0 0 0 #ccc;
        .el-radio-button__orig-radio,
        input {
          width: 400px;
          height: 48px;
          border-radius: 8px 8px 0px 0px;
        }
        img {
          position: relative;
          top: -12px;
          left: 0px;
        }
        div {
          img {
            position: relative;
            top: 2px;
            left: -7px;
          }
        }
      }
    }
    .gsContents {
      display: flex;
      justify-content: space-between;
      margin: 0 auto;
      width: 1200px;
      min-height: 430px;
      background: #fff;
      overflow: hidden;
      .left {
        width: 590px;
        background-color: #fff;
        line-height: 40px;
        .leftTitle {
          display: flex;
          justify-content: space-between;
          align-items: center;
          margin-bottom: 30px;
          background: #f0f2f5;
          h2 {
            padding-left: 20px;
            font-size: 16px;
            color: #333;
          }
          span {
            display: inline-block;
            margin-right: 15px;
            font-size: 14px;
            color: #969699;
            cursor: pointer;
          }
          span:hover {
            color: #08a579;
          }
        }

        .gsResbox {
          .kejianBox1 {
            display: flex;
            align-items: center;
            margin-left: 20px;
            margin-bottom: 0px;
            width: 550px;
            height: 124px;
            background: #f9f9f9;
            border-radius: 10px;
            cursor: pointer;
            .kejianfile {
              margin-left: 20px;
              height: 84px;
              img {
                width: 74px;
                height: 84px;
              }
            }
            .msg {
              margin-left: 20px;
              .title {
                margin-top: 8px;
                margin-bottom: 0;
                margin-left: 0;
                width: 402px;
                font-size: 15px;
                line-height: 22px;
                font-weight: normal;
                color: #333;
                display: -webkit-box;
                -webkit-line-clamp: 2;
                overflow: hidden;
                text-overflow: ellipsis;
                -webkit-box-orient: vertical;
              }

              .bottom {
                color: #939599;
                .seeNum {
                  margin-left: 30px;
                  i {
                    display: inline-block;
                    margin-right: 6px;
                  }
                }
              }
            }
          }
          .kejianBox1:hover {
            .title {
              color: #08a579;
            }
          }
          .kejianBox2 {
            display: flex;
            margin-bottom: 8px;
            align-items: center;
            height: 50px;
            .kejianfile {
              display: flex;
              align-items: center;
              margin-left: 20px;
              height: 20px;
              img {
                width: 18px;
                height: 20px;
              }
            }
            .title {
              width: 450px;
              font-size: 15px;
              color: #333;
              font-weight: normal;
              overflow: hidden;
              white-space: nowrap;
              text-overflow: ellipsis;
            }
            span {
              color: #939599;
            }
          }
        }
        .nothingGszy {
          text-align: center;
        }
      }
      .right {
        width: 590px;
        background: #fff;
        line-height: 40px;
        h2 {
          padding-left: 20px;
          margin-bottom: 30px;
          width: 570px;
          font-size: 16px;
          color: #333;
          background: #f0f2f5;
        }
        .gsResbox {
          display: flex;
          flex-wrap: wrap;
          .picTap1 {
            margin-left: 20px;
            margin-bottom: 20px;
            height: 100px;
            cursor: pointer;
            img {
              width: 170px;
              height: 100px;
            }
          }

          .picTap2 {
            margin-left: 20px;
            margin-bottom: 20px;
            cursor: pointer;
            img {
              width: 170px;
              height: 160px;
            }
          }
        }
      }
    }
    .recommend {
      width: 1200px;
      margin: 0 auto;
      // padding-top: 20px;
      background-color: #fff;
      // border-radius: 10px;
      overflow: hidden;
      .recommend {
        // margin-top: 20px;
        .someRecommend {
          .resMsg {
            margin-bottom: 10px;
            background: #ffffff;
            // border: 1px solid #dee0e3;
            .msg {
              width: 1170px;
              padding: 20px 0 40px 20px;
              background-color: #fff;
              p {
                font-size: 14px;
                font-family: Microsoft YaHei;
                color: #646566;
              }
            }
            .nothing {
              text-align: center;
            }
            .littleTittle {
              width: 1200px;
              height: 40px;
              background-color: #f0f2f5;
              h3 {
                margin-left: 20px;
                font-size: 16px;
                font-family: Microsoft YaHei;
                font-weight: bold;
                color: #333333;
                line-height: 40px;
              }
            }
            .beike {
              margin: 10px auto;
              border-radius: 10px;
              width: 1150px;
              background-color: #fff;
              .beike1 {
                display: flex;
                justify-content: space-between;
                align-items: center;
                padding: 20px 0;
                // width: 1160px;
                // height: 264px;
                background: #f9f9f9;
                border-radius: 10px;
                .left {
                  text-align: center;
                  width: 156px;
                  img {
                    width: 80px;
                    height: 80px;
                  }
                }
                .details {
                  display: flex;
                  flex-direction: column;
                  justify-content: space-around;
                  width: 639px;
                  .title {
                    display: flex;
                    margin: 0;
                    line-height: 34px;
                    span {
                      display: inline-block;
                      // position: relative;
                      // top: 8px;
                      margin-top: 8px;
                      margin-right: 10px;
                      width: 48px;
                      height: 20px;
                      background: #f85230;
                      border-radius: 4px;
                      font-size: 14px;
                      color: #ffffff;
                      line-height: 20px;
                      text-align: center;
                    }
                    h3 {
                      // margin-left: 10px;
                      width: 600px;
                      font-size: 16px;
                      font-weight: bold;
                      color: #333333;
                      overflow: hidden;
                      text-overflow: ellipsis;
                      display: -webkit-box;
                      -webkit-box-orient: vertical;
                      -webkit-line-clamp: 2;
                      cursor: pointer;
                    }
                    h3:hover {
                      color: #08a579;
                    }
                  }
                  .msg {
                    padding: 0;
                    width: 700px;
                    font-size: 14px;
                    color: #626366;
                    background-color: #f9f9f9;
                    p {
                      margin-bottom: 20px;
                      font-size: 14px;
                      // height: 120px;
                      line-height: 24px;
                      overflow: hidden;
                    }
                    .shengluehao {
                      display: inline-block;
                      margin-bottom: 20px;
                    }
                    .bottom {
                      color: #939599;
                      font-size: 12px;
                      .upTime {
                        margin-right: 29px;
                      }
                      .seeNum {
                        margin-right: 30px;
                        i {
                          margin-right: 5px;
                        }
                      }
                      .recNum {
                        a {
                          color: red;
                        }
                      }
                    }
                  }
                }
                .seeAll {
                  text-align: center;
                  width: 260px;
                  height: 110px;
                  border-left: 1px solid #e6e6e6;
                  cursor: pointer;
                  span {
                    display: inline-block;
                    margin-top: 30px;
                    text-align: center;
                    width: 120px;
                    height: 40px;
                    background: #08a579;
                    border-radius: 4px;
                    color: #ffffff;
                    font-size: 16px;
                    line-height: 40px;
                  }
                }
              }
              .beike2 {
                display: flex;
                align-items: center;
                padding: 20px 0;
                background-color: #fff;
                img {
                  margin: 0 40px 0 50px;
                  width: 60px;
                  height: 60px;
                }
                .details {
                  display: flex;
                  flex-direction: column;
                  justify-content: space-between;
                  min-height: 60px;
                  .title {
                    display: flex;
                    margin: 0;
                    span {
                      display: inline-block;
                      // position: relative;
                      // top: 2px;
                      margin-top: 2px;
                      width: 40px;
                      height: 20px;
                      background: #f85230;
                      border-radius: 4px;
                      font-size: 14px;
                      color: #ffffff;
                      line-height: 20px;
                      text-align: center;
                    }
                    h3 {
                      margin-left: 5px;
                      width: 600px;
                      font-size: 16px;
                      font-weight: bold;
                      color: #333333;
                      overflow: hidden;
                      text-overflow: ellipsis;
                      display: -webkit-box;
                      -webkit-box-orient: vertical;
                      -webkit-line-clamp: 2;
                    }
                  }
                  .msg {
                    padding-left: 0;
                    padding: 0;
                  }
                  .bottom {
                    color: #939599;
                    font-size: 12px;
                    .upTime {
                      margin-right: 29px;
                    }
                    .seeNum {
                      margin-right: 30px;
                      i {
                        margin-right: 5px;
                      }
                    }
                    .recNum {
                      a {
                        color: red;
                      }
                    }
                  }
                }
              }
            }
            .jiaoyan {
              display: flex;
              // justify-content: space-around;
              flex-wrap: wrap;
              margin: 0 40px 0 20px;
              padding: 30px 0 10px 0;
              width: 1200px;
              .box {
                margin-bottom: 20px;
                background-color: #fff;
                border-radius: 10px;
                cursor: pointer;
                img {
                  margin-bottom: 10px;
                  width: 360px;
                  height: 203px;
                  border-radius: 10px;
                }
                .activename {
                  margin-bottom: 18px;
                  width: 320px;
                  font-size: 16px;
                  font-family: Microsoft YaHei;
                  color: #333333;
                }
                p {
                  font-size: 14px;
                  color: #939599;
                }
              }
              .box:hover {
                // transition: 1s;
                img {
                  transition: 0.5s;
                  // position: relative;
                  // top: -10px;
                  transform: translateY(-10px);
                  box-shadow: 0px 2px 10px 2px #dedede;
                }
                .activename {
                  color: #08a579;
                }
              }
            }
          }
          .active {
            display: flex;
            margin-bottom: 34px;
            border-bottom: 1px solid #dee0e3;
            .top {
              margin-bottom: 20px;
              background-color: #fff;
              span {
                position: relative;
                top: 25px;
                display: inline-block;
                width: 4px;
                height: 20px;
                background: #08a579;
                border-radius: 2px;
              }
              h2 {
                margin-left: 20px;
              }
            }
            .left {
              width: 800px;
              .content {
                display: flex;
                img {
                  width: 360px;
                  height: 186px;
                  border-radius: 10px;
                  background-color: #ccc;
                }
                .msg {
                  margin-left: 20px;
                  h2 {
                    margin-bottom: 10px;
                    font-family: Microsoft YaHei;
                    width: 353px;
                    height: 45px;
                    font-size: 16px;
                    color: #333333;
                  }
                  p {
                    margin-bottom: 10px;
                    text-align: center;
                    width: 150px;
                    height: 24px;
                    background: #fdeff0;
                    border-radius: 4px;
                    font-size: 14px;
                    color: #f63842;
                    line-height: 24px;
                  }
                  span {
                    display: block;
                    color: #939599;
                    font-size: 14px;
                  }
                  button {
                    margin-top: 37px;
                    width: 140px;
                    height: 40px;
                    background: #f85230;
                    border-radius: 4px;
                    border: 0;
                    color: #ffffff;
                  }
                }
              }
            }
            .right {
              width: 400px;
            }
          }
        }
        .test {
          display: flex;
          margin-left: 20px;
          margin-bottom: 40px;
          line-height: 36px;
          width: 540px;
          height: 36px;
          background: #ffffff;
          border: 1px solid #dee0e3;
          border-radius: 4px;
          p {
            margin-left: 21px;
            margin-right: 50px;
            color: #646566;
            font-size: 14px;
          }
          .el-radio {
            margin-top: 10px;
            // margin-left: 35px;
          }
          button {
            position: relative;
            left: 103px;
            width: 80px;
            height: 36px;
            color: #ffffff;
            background: #08a579;
            border: 0;
            border-radius: 4px;
            cursor: pointer;
          }
        }
      }
    }
  }
  .pickAcPr {
    display: flex;
    margin: 0 auto;
    width: 1200px;
    background-color: #fff;
    border-top: 1px solid #e1e3e5;
    .pickAC {
      margin-right: 40px;
      width: 760px;
      .pickTop {
        display: flex;
        align-items: center;
        padding-top: 30px;
        padding-bottom: 20px;
        background-color: #fff;
        span {
          display: inline-block;
          margin-right: 10px;
          width: 4px;
          height: 20px;
          background: #08a579;
          border-radius: 2px;
        }
        font-size: 20px;
      }
      .left {
        position: relative;
        display: flex;
        height: 240px;
        border-radius: 10px;
        img {
          // margin-top: 20px;
          margin-left: 20px;
          width: 360px;
          height: 200px;
          // border-radius: 10px;
          // background-color: #ccc;
        }
        .banner {
          border-radius: 10px;
        }
        .yuyue {
          position: absolute;
          top: 0px;
          left: 325px;
          margin: 0;
          width: 54px;
          height: 54px;
        }
        .msg {
          margin-left: 20px;
          margin-right: 10px;
          h2 {
            margin-top: 10px;
            margin-bottom: 10px;
            font-family: Microsoft YaHei;
            width: 350px;
            font-size: 16px;
            color: #333333;
            overflow: hidden;
            text-overflow: ellipsis;
            display: -webkit-box; //使用自适应布局
            -webkit-line-clamp: 2; //设置超出行数，要设置超出几行显示省略号就把这里改成几
            -webkit-box-orient: vertical;
          }
          p {
            margin-top: 10px;
            text-align: center;
            width: 120px;
            height: 20px;
            background: #fdeff0;
            border-radius: 4px;
            font-size: 14px;
            color: #f63842;
            line-height: 20px;
            font-size: 12px;
          }
          span {
            display: block;
            color: #939599;
            font-size: 14px;
          }
          .playAnniu {
            position: absolute;
            bottom: 40px;
            width: 140px;
            height: 40px;
            font-size: 16px;
            text-align: center;
            line-height: 40px;
            background: #fc8d2f;
            border-radius: 4px;
            color: #fff;
            cursor: pointer;
            img {
              position: relative;
              top: 4px;
              right: 7px;
              margin: 0;
              width: 20px;
              height: 20px;
            }
          }
        }
      }
    }
    .pickPr {
      .pickTop {
        display: flex;
        align-items: center;
        padding-top: 30px;
        padding-bottom: 20px;
        background-color: #fff;
        span {
          display: inline-block;
          margin-right: 10px;
          width: 4px;
          height: 20px;
          background: #08a579;
          border-radius: 2px;
        }
        font-size: 20px;
      }
      .right {
        .prBox {
          display: flex;
          align-items: center;
          margin-bottom: 20px;
          cursor: pointer;
          img {
            margin-right: 30px;
            width: 72px;
            height: 96px;
          }
          .msg {
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            height: 96px;
            h3 {
              font-size: 14px;
              font-weight: normal;
              color: #333;
              overflow: hidden;
              text-overflow: ellipsis;
              display: -webkit-box; //使用自适应布局
              -webkit-line-clamp: 2; //设置超出行数，要设置超出几行显示省略号就把这里改成几
              -webkit-box-orient: vertical;
            }
            p {
              color: #939599;
              font-size: 14px;
            }
            span {
              display: inline-block;
              text-align: center;
              line-height: 20px;
              font-size: 12px;
              width: 120px;
              height: 20px;
              background: #faebec;
              border-radius: 4px;
              color: #f6444e;
            }
            .highF {
              color: #08a579;
              background: #ebfaf5;
            }
          }
        }
        .prBox:hover {
          .msg {
            h3 {
              color: #08a579;
            }
          }
        }
      }
    }
  }
  .baibaoxiang {
    width: 1200px;
    margin: 20px auto;
    margin-bottom: 70px;
    background-color: #fff;
    border-radius: 10px;
    overflow: hidden;
    h2 {
      margin-top: 30px;
      margin-left: 20px;
      font-size: 24px;
      color: #333;
    }
    .content {
      display: flex;
      justify-content: space-around;

      .box {
        margin: 40px 0;
        text-align: center;
        width: 200px;
        height: 160px;
        background-color: #f9f9f9;
        border: 1px solid #fff;
        cursor: pointer;
        img {
          margin-top: 20px;
          margin-bottom: 12px;
        }
        p {
          text-align: center;
          font-size: 14px;
        }
      }
      .box:hover {
        border: 1px solid #08a579;
        background-color: #fff;
      }
    }
  }
  .dadabox {
    .dadabox1 {
      width: 200px;
      height: 200px;
      background-color: red;
    }
    .dadabox2 {
      width: 200px;
      height: 200px;
      background-color: blue;
    }
  }
  //首次弹出框的样式
  .chose {
    position: relative;
    margin-left: 40px;
    cursor: pointer;
    p {
      margin: 20px 0;
      margin-bottom: 20px;
      color: #646566;
    }
    .taps {
      display: flex;
      flex-wrap: wrap;
      .classRadio {
        display: flex;
        margin-right: 79px;
        .tips {
          position: relative;
          top: 2px;
          margin-right: 8px;
          width: 14px;
          height: 14px;
          border: 1px solid #cccccc;
          border-radius: 100%;
          line-height: 12px;
          text-align: center;
          span {
            display: inline-block;
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translateX(-50%) translateY(-50%);
            width: 9px;
            height: 9px;
            background-color: #fff;
            border-radius: 100%;
          }
        }
        .tips2 {
          border: 1px solid #08a579;

          span {
            background-color: #08a579;
          }
        }
        p {
          margin: 0;
        }
      }
    }
    .tab2 {
      .classRadio {
        margin-bottom: 10px;
      }
    }
    .submitSet {
      position: absolute;
      right: 20px;
      bottom: -80px;
      width: 120px;
      height: 40px;
      background: #08a579;
      color: #fff;
      border-radius: 6px;
      text-align: center;
      line-height: 40px;
      cursor: pointer;
    }
  }
  /deep/.el-dialog--center {
    border-radius: 10px;
    padding-bottom: 80px;
  }
  /deep/.el-dialog__header {
    padding: 0;
  }

  //首页更新提醒弹窗
  .upDateBox{
    position: relative;
    h3{
      margin-bottom: 30px;
      font-size: 16px;
      text-align: center;
      color: #333;
    }
    p{
      margin: 0 auto;
      font-size: 12px;
      width: 400px;
      line-height: 20px;
      color: #666;
    }
    .pic{
      margin-top: 40px;
      display: flex;
      justify-content: space-around;
      .evm{
        display: flex;
        flex-direction: column;
        align-items: center;
        // justify-content: center;
        width: 120px;
        img{
          margin-bottom: 20px;
          width: 120px;
          height: 120px;
        }
        p{
          text-align: center;
        }
      }
    }
    .liaojie{
      position: absolute;
      right: 20px;
      bottom: -80px;
      width: 120px;
      height: 36px;
      background-color: #08a579;
      text-align: center;
      color: #FFF;
      line-height: 36px;
      font-size: 14px;
      border-radius: 10px;
    }
  }
  // .resource {
  //   background-color: #fff;
  //   .content {
  //     width: 1200px;
  //     margin: 0 auto;
  //     padding-bottom: 30px;
  //     .resBox {
  //       display: flex;
  //       margin-top: 30px;
  //       .hotRes {
  //         display: flex;
  //         width: 600px;
  //         img {
  //           width: 160px;
  //           height: 250px;
  //           background-color: red;
  //         }
  //         .msg {
  //           margin-left: 20px;
  //           .top {
  //             display: flex;
  //             justify-content: space-between;
  //             padding-bottom: 3px;
  //             width: 380px;
  //             background-color: #fff;
  //             border-bottom: 1px solid #ccc;
  //             .littleTips {
  //               width: 5px;
  //               height: 30px;
  //               background-color: blue;
  //               border-radius: 10px;
  //             }
  //             p {
  //               margin-right: 230px;
  //               font-size: 20px;
  //               font-weight: 600;
  //             }
  //           }
  //           ul {
  //             margin-top: 20px;
  //             li {
  //               display: flex;
  //               font-size: 16px;
  //               line-height: 40px;
  //             }
  //           }
  //         }
  //       }
  //       .tabRes {
  //         .msg {
  //           ul {
  //             margin-top: 0;
  //           }
  //         }
  //       }
  //     }
  //   }
  // }
  // .product {
  //   .content {
  //     width: 1200px;
  //     margin: 0 auto;
  //     padding-bottom: 3 0px;
  //     .proBox {
  //       display: flex;
  //       justify-content: space-between;
  //       .box {
  //         text-align: center;
  //         img {
  //           width: 350px;
  //           height: 175px;
  //           background-color: red;
  //         }
  //         h3 {
  //           margin: 10px auto;
  //           font-size: 18px;
  //         }
  //         p {
  //           font-size: 13px;
  //         }
  //         span {
  //           display: inline-block;
  //           margin-top: 20px;
  //           width: 80px;
  //           line-height: 20px;
  //           border: 1px solid #666;
  //         }
  //       }
  //       box:hover span {
  //         border: 1px solid #e4c567;
  //       }
  //     }
  //   }
  // }
  // .xuexiao {
  //   background-color: #fff;
  //   .content {
  //     width: 1200px;
  //     margin: 0 auto;
  //     ul {
  //       display: flex;
  //       justify-content: space-between;
  //     }
  //   }
  // }
}
</style>
